<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title> 直播数据录入 </title>
    <link rel="stylesheet" href="/v3/css/basic.css" type="text/css"/>

    <script type="text/javascript" src="/v3/js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="/v3/js/index.js"></script>
    <!--标准mui.css-->
    <link rel="stylesheet" href="/v3/mui/css/mui.min.css">
    <link href="/v3/mui/css/mui.picker.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="/v3/css/style.css" type="text/css"/>
</head>
<body>
<header class="mui-bar mui-bar-nav">
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">直播数据录入</h1>
</header>
<div class="container  mui-content">
    <div class="new-media-form">
        <div class="new-media-item">
                    <span class="label must" >
                        选择账号
                    </span>
            <div class="input-box select" id='showUserPicker'>
                <div id="account"></div>
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                    直播日期
                    </span>
            <div class="input-box select choose"  id="chooseDate" data-options='{"type":"date"}'></div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                    开播时间
                    </span>
            <div class="input-box select choose" id="startTime"  data-options='{"type":"time"}'></div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                    下播时间
                    </span>
            <div class="input-box select choose" id="endTime"  data-options='{"type":"time"}'></div>

        </div>
        <div class="new-media-item">
                    <span class="label must">
                        观众总数
                    </span>
            <div class="input-box">
                <input type="text" name="currentNum" id="currentNum">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        新增粉丝
                    </span>
            <div class="input-box">
                <input type="text" name="newNum" id="newNum">
            </div>
        </div>

        <div class="new-media-item">
                    <span class="label must">
                        评论人数
                    </span>
            <div class="input-box">
                <input type="text" name="replyNum" id="replyNum">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        观看来源（视频推荐）
                    </span>
            <div class="input-box">
                <input type="text" id="videoCommand" name="videoCommand">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        观看来源（直播广场）
                    </span>
            <div class="input-box">
                <input type="text" id="live" name="live">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        观看来源（同城）
                    </span>
            <div class="input-box">
                <input type="text" id="sameCity" name="sameCity">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        观看来源（关注页）
                    </span>
            <div class="input-box">
                <input type="text" id="attentionPage" name="attentionPage">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must" >
                        观看来源（其他）
                    </span>
            <div class="input-box">
                <input type="text" id="other" name="other">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        支付子订单
                    </span>
            <div class="input-box">
                <input type="text" id="payOrderNum" name="payOrderNum">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label must">
                        支付金额
                    </span>
            <div class="input-box">
                <input type="text" id="payPrice" name="payPrice">
            </div>
        </div>
        <div class="new-media-item">
                    <span class="label">
                        分析总结
                    </span>
            <textarea name="summary" id="summary" cols="3" rows="5"></textarea>
        </div>
        <div class="new-media-item">
                    <span class="label">
                        改进措施
                    </span>
            <textarea name="measures" id="measures" cols="3" rows="5"></textarea>
        </div>
        <div class="opt-btn" id="mediaSava">
            提交
        </div>

        　　　
    </div>
</div>
</div>
</body>
<script src="/v3/mui/js/mui.min.js"></script>
<script src="/v3/mui/js/mui.picker.min.js"></script>


<script>
    var accountValue
    (function($, doc) {
        // 选择账户
        $.init();
        $.ready(function() {
            /**
             * 获取对象属性的值
             * 主要用于过滤三级联动中，可能出现的最低级的数据不存在的情况，实际开发中需要注意这一点；
             * @param {Object} obj 对象
             * @param {String} param 属性名
             */
            var _getParam = function(obj, param) {
                return obj[param] || '';
            };
            var userPicker = new $.PopPicker();
            $.ajax({
                url: "/ajax/getMediaList",
                type: "get",
                dataType:"json",
                success:function (res) {
                    // console.log(JSON.stringify(res));
                    if(res.code == 0){
                        userPicker.setData(res.data);
                    }
                }
            })
            // userPicker.setData([{
            //     value: '1',
            //     text: '抖音-桃森森'
            // }, {
            //     value: '2',
            //     text: '抖音-虞姬'
            // }, {
            //     value: '3',
            //     text: '抖音-虞姬2'
            // }, {
            //     value: '4',
            //     text: '抖音-虞姬3'
            // }, {
            //     value: '5',
            //     text: '抖音-虞姬4'
            // }, {
            //     value: '6',
            //     text: '抖音-虞姬5'
            // }]);
            var showUserPickerButton = doc.getElementById('showUserPicker');
            var accoutBox = doc.getElementById('account');
            showUserPickerButton.addEventListener('tap', function(event) {
                userPicker.show(function(items) {
                    var text = items[0].text // 账户被选中的项的文字
                    accountValue = items[0].value // 账户被选中的项的值
                    accoutBox.innerText = text;
                });
            }, false);
        });
        // 选择日期
        var btns = $('.choose');
        btns.each(function(i, btn) {
            btn.addEventListener('tap', function() {

                var _self = this;
                if(_self.picker) {
                    _self.picker.show(function (rs) {
                        $(_self)[0].innerText = rs.text;
                        _self.picker.dispose();
                        _self.picker = null;
                    });
                } else {
                    var optionsJson = this.getAttribute('data-options') || '{}';
                    var options = JSON.parse(optionsJson);
                    var id = this.getAttribute('id');
                    _self.picker = new $.DtPicker(options);
                    _self.picker.show(function(rs) {
                        $(_self)[0].innerText  = rs.text;
                        _self.picker.dispose();
                        _self.picker = null;
                    });
                }

            }, false);
        })

    })(mui, document);
    // 保存
    $('#mediaSava').click(function(){
        // accountValue 账户
        var chooseDate = $('#chooseDate').html() // 直播日期
        var startTime = $('#startTime').html() // 开播时间
        var endTime = $('#endTime').html() // 下播时间
        var currentNum = $('#currentNum').val() // 观众总数
        var newNum = $('#newNum').val() // 新增粉丝
        var replyNum = $('#replyNum').val() // 评论人数
        var videoCommand = $('#videoCommand').val() // 观看来源-视频推荐
        var live = $('#live').val() // 观看来源-直播广场
        var sameCity = $('#sameCity').val() // 观看来源-同城
        var attentionPage = $('#attentionPage').val() // 观看来源-关注页
        var other = $('#other').val() // 观看来源-视频推荐
        var payOrderNum = $('#payOrderNum').val() // 支付子订单数
        var payPrice = $('#payPrice').val() // 支付金额
        var summary = $('#summary').val()
        var measures = $('#measures').val()
        var data = {
            'accountId':accountValue,
            'liveDate':chooseDate,
            'startTime':startTime,
            'endTime':endTime,
            'viewCount':currentNum,
            'newUser':newNum,
            'commentCount':replyNum,
            'source1':videoCommand,
            'source2':live,
            'source3':sameCity,
            'source4':attentionPage,
            'source5':other,
            'orderCount':payOrderNum,
            'orderAmount':payPrice,
            'summary':summary,
            'improvement':measures
        }
        console.log(JSON.stringify(data))
        $.ajax({
            url: "/ajax/live_data_input",
            type: "POST",
            dataType: "json",
            contentType: "application/json",
            data: JSON.stringify(data),
            success: function (res) {
                console.log(JSON.stringify(res));
                if(res.code == 0){
                    alert("添加成功！");
                    window.location.href = '/live/data_report_m';
                }else{
                    alert(res.msg);
                }
            }
        });
        // ajax
        // console.log(accountValue,chooseDate,startTime,endTime,
        //     currentNum,newNum,replyNum,videoCommand,
        //     live,sameCity,attentionPage,other,payOrderNum,payPrice,
        //     summary,measures)
    })


</script>




</html>